import "./index.css";

const body = document.body;

const cover = document.createElement('div');
cover.className = "cover";

const primaryAlert = (text = "主要") => {
    createAlert(text, "primary")
}
const secondaryAlert = (text = "次要") => {
    createAlert(text, "secondary")
}

/*const successAlert = (text = "成功") => {
    createAlert(text, "success")
}*/

function successAlert(text = "成功") {
    createAlert(text, "success")
}

const dangerAlert = (text = "危险") => {
    createAlert(text, "danger")
}
const warningAlert = (text = "注意") => {
    createAlert(text, "warning")
}
const infoAlert = (text = "信息") => {
    createAlert(text, "info")
}
const lightAlert = (text = "明亮") => {
    createAlert(text, "light")
}
const darkAlert = (text = "黑暗") => {
    createAlert(text, "dark")
}

/*primaryAlert()
secondaryAlert()
successAlert()
dangerAlert()
warningAlert()
infoAlert()
lightAlert()
darkAlert()*/

/*const closeAlert = (a,b,c) => {
console.log(a,b,c)
}*/

body.insertBefore(cover, body.firstChild);

function closeAlert(event) {
    event.target.parentNode.remove();
}

function createAlert(text, type) {
    let alert = document.createElement("div");
    alert.innerText = text;
    alert.className = "alert " + type;

    let close = document.createElement("span");
    close.innerText = "X";
    close.addEventListener("click", closeAlert, false);

    alert.appendChild(close);
    //console.log(cover.lastChild)
    cover.appendChild(alert);
    //cover.insertBefore(alert, cover.lastChild);


    setTimeout(() => {
        alert.style.animationName = "bounceOutDown";
        setTimeout(() => {
            alert.remove()
        }, 600);
    }, 1800);
}


export default {
    primaryAlert,
    secondaryAlert,
    successAlert,
    dangerAlert,
    warningAlert,
    infoAlert,
    lightAlert,
    darkAlert,
    createAlert,
    closeAlert,
}
